<template>
	<view class="list page bgf6 c00">
		<view class="bgff py12 px20">
			<view class="flex flexC">
				<input class="px10 flex1 bor r40 py5" type="number" placeholder="请输入用户手机号" placeholder-class="cbe"
					v-model="mobile">
				<view class="aliR flex1 fs14" @click="searchList">
					<text class="bged px12 py7 r40">查询</text>
				</view>

			</view>

		</view>
		<scroll-view scroll-y="true" class="list" @scrolltolower="nextPage">

			<view class="bgff flex flexC flexB aliC rel r7 py20 mt16 mx12 shadow">
				<view class="flex1 borr">
					<view class="bold6 fs20">{{total}}个</view>
					<view class="c85 mb8">总会员数</view>
				</view>

				<view class="flex1">
					<view class="bold6 fs20">{{charge}}个</view>
					<view class="c85 mb8">充值会员数</view>
				</view>
			</view>

			<view v-for="item in list">
				<view class="bgff mx12 mt16 py20 px14">
					<view class="mb6">手机号：{{item.user.mobile}}</view>
					<view>注册时间：{{item.user.create_time_txt}}</view>
					<view class="flex flexC flexE mt10 aliC">
						<text class="flex1 bged r40 w72 py2 mx3" @click="queryConsume(item)">消费数据</text>
						<text class="flex1 bged r40 w72 py2 mx3" @click="queryBalance(item)">查询余额</text>
<!-- 						<text class="flex1 bged r40 w72 py2 mx3" @click="showAddBalance(item.user)">添加余额</text> -->
					</view>
				</view>
				
				
			</view>
			
			<hFormAlert v-if="tagShow"  title="添加充值" placeholder="请输入添加充值金额" @confirm="confirm" @cancel="cancel"></hFormAlert>
			
		</scroll-view>


		<!-- 店铺选择 -->
		<uni-popup ref="shopPicker" type="bottom">
			<shop-list @search="search" :list="shopList" @onSelectShop="onSelectShop" @close="onClose"></shop-list>
		</uni-popup>
	</view>
</template>

<script>
	import hFormAlert from '@/components/h-form-alert/h-form-alert.vue';
	
	export default {
		
		components: {
			hFormAlert
		},
		
		data() {
			return {
				shopList: [],
				selectShop: null,
				page: 1,
				list: [],
				isLastPage: false,
				isnodata: false,
				total: 0,
				charge: 0,
				mobile: '',
				startTime: '开始时间',
				endTime: '结束时间',
				unAmount: 0,
				tagShow:false,
				currentUser:null

			};
		},
		onLoad(option) {

			var select = option.selectShop;

			if (select != null) {
				this.selectShop = JSON.parse(select);
			}
			this.getShopList();
			this.getList();
		},
		methods: {
			
			cancel() {
				this.tagShow = false;
			},
			
			confirm(e) {
				this.tagShow = false;
				console.info(e.text);
				let that = this;
				let param = {
					amount: e.text,
					shop_id: this.selectShop.id,
					mobile: this.currentUser.mobile,
				}
				this.$api.addBalance(param).then(res => {
			
					uni.hideLoading();
					if (res.code == 1) {
						uni.showModal({
							title:"添加成功"
						})
					} else {
						uni.showToast({
							title:res.msg
						})
					}
				})
			},
			
			showAddBalance(item){
				console.info("======showAddBalance=====");
				this.currentUser = item;
				this.tagShow = true;
			},

			queryConsume(item) {
				let param = {
					shop_id: this.selectShop.id,
					mobile: item.user.mobile,

				};
				let that = this;
				this.$api.consumerData(param).then(res => {
					if (res.code == 1) {
						uni.showModal({
							title: "消费数据",
							content: "包厢预定：" + res.data.book_amount + "元 " + "，预定数：" + res.data
								.book_count +
								"，余额充值：" + res.data.charge_amount + "元",
							showCancel: false
						})
					} else {

					}
				})
			},
			queryBalance(item) {
				let param = {
					shop_id: this.selectShop.id,
					mobile: item.user.mobile,

				};
				let that = this;
				this.$api.balance(param).then(res => {
					if (res.code == 1) {
						uni.showModal({
							title: "用户余额",
							content: "用户余额：" + res.data + "元 ",
							showCancel: false
						})
					} else {

					}
				})
			},
			addBalance() {

			},


			dateStartChange(e) {
				this.startTime = e.detail.value;
				console.info(e);
			},
			dateEndChange(e) {
				this.endTime = e.detail.value;
			},


			searchList() {
				console.info('==mobile===' + this.mobile)
				this.page = 1;
				this.list = [];
				this.isnodata = false;
				this.isLastPage = false;
				this.getList();
			},

			nextPage() {
				if (this.isLastPage) return;
				this.page += 1;
				this.getList();
			},

			getList() {

				var start = this.startTime;
				if (this.startTime == '开始时间') {
					start = "";
				}
				var end = this.endTime;

				if (this.endTime == '结束时间') {
					end = "";
				}

				let param = {
					page: this.page,
					shop_id: this.selectShop.id,
					mobile: this.mobile,

				};
				let that = this;
				this.$api.vipList(param).then(res => {
					if (res.code == 1) {
						let length = res.data.list.length;
						that.total = res.data.total;
						that.charge = res.data.charge;

						for (let i = 0; i < length; i++) {
							that.list.push(res.data.list[i]);
						}
						if (length < 10) {
							this.isLastPage = true;
						}
						if (that.list.length > 0) {
							that.isnodata = false;
						} else {
							that.isnodata = true;
						}
					} else {

					}
				})
			},

			onClose() {
				this.$refs.shopPicker.close();
			},
			getShopList() {
				let param = {
					keyword: this.keyword
				};
				let that = this;
				this.$api.getShopList(param).then(res => {

					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.shopList = res.data;
						if (that.shopList.length > 0) {

						}
					} else {

					}
				})
			},

			showShop() {
				this.$refs.shopPicker.open();

			},
			search(value) {

				this.keyword = value;
				this.getShopList();
			},

			onSelectShop(item) {
				this.selectShop = item;
				this.$refs.shopPicker.close();
				this.page = 1;
				this.list = [];
				this.isnodata = false;
				this.isLastPage = false;
				this.getList();
			},
		}
	}
</script>

<style lang="scss">
	.list{
		height: 100%;
	}
	.w100 {
		width: 160rpx;
	}
</style>